
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="js/elementui/index.css">
    <script src="js/vue.js"></script>
    <script  src="js/elementui/index.js"></script>
    <script src="js/axios.min.js"></script>
    <link rel="stylesheet" href="css/tea.css">
</head>
<body>
<div id="app">

    <div>
        <el-input  v-model="cour_name" placeholder="请输入内容"></el-input>
        <el-button type="success" @click="search">搜索</el-button>
        <el-button
                type="primary"
                @click="showAddCourseDialog">添加
        </el-button>


        <el-button icon="el-icon-refresh" type="primary" onclick=" window.location.reload();">刷新</el-button>

    </div>

    <el-table :data="tableData" style="width: 100%" >
        <el-table-column
                type="index"
                width="40">
        </el-table-column>
        <el-table-column prop="courPicurl" label="课程图片" width="160">
            <template slot-scope="scope">
                <div class="photo">
                    <img style="width:100px" :src="scope.row.courPicurl">
                </div>
            </template>
        </el-table-column>
        <el-table-column prop="courPrice" label="课程价格" width="100">
        </el-table-column>

        <el-table-column show-overflow-tooltip prop="courName" label="课程名称"  width="100">
        </el-table-column>
        <el-table-column show-overflow-tooltip prop="courMark" label="学分"  width="100">
        </el-table-column>
        <el-table-column prop="courContent"
                         show-overflow-tooltip label="课程描述">
        </el-table-column>

        <el-table-column label="操作">

            <template slot-scope="scope">
                <el-button size="mini"  @click="getCommit(scope.row)" >管理</el-button>

                </el-breadcrumb>
                <el-button size="mini"  type="primary" @click="showUpdateUserDialog(scope.row)">修改
                </el-button>
                <el-button size="mini"
                           type="danger"
                           @click="handleDelete(scope.$index, scope.row)">删除
                </el-button>
                <el-button size="mini"
                           @click="hanfgg(scope.row)">公告
                </el-button>
            </template>
        </el-table-column>
    </el-table>

    <el-dialog
            width="40%"
            :title="addCourseDialog.title"
            :visible.sync="addCourseDialog.show">
        <el-form   ref="addForm" label-position="left" :model="addCourseDialog" label-width="80px">

            <el-form-item prop="courName" label="课程名称">
                <el-input placeholder="请输入课程名称" v-model="addCourseDialog.courName" :disabled="addCourseDialog.nameDisabled" ></el-input>
            </el-form-item>
            <el-form-item prop="courPrice" label="课程价格">
                <el-input-number v-model="addCourseDialog.courPrice"  :min="0" ></el-input-number>
            </el-form-item>
            <el-form-item prop="courMark" label="学分">
                <el-input-number  v-model="addCourseDialog.courMark" :min="0" :max="100" ></el-input-number>
            </el-form-item>
            <el-form-item prop="courContent" label="课程内容">
                <el-input placeholder="请输入课程内容" type="textarea" v-model="addCourseDialog.courContent" ></el-input>
            </el-form-item>
            <!--<el-form-item  label="开课日期">
               <el-date-picker
                        v-model="addCourseDialog.courOpentime"
                        type="datetime"
                        placeholder="选择日期">
                </el-date-picker>~<el-date-picker
                    v-model="addCourseDialog.courClosetime"
                    type="datetime"
                    placeholder="选择日期">
            </el-date-picker>-->
                <!--<el-date-picker
                        v-model="addCourseDialog.courOpentime"
                        type="datetimerange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期">
                </el-date-picker>-->
            </el-form-item>
            <el-form-item label="图片">
                <el-input type="file" id="Picurlfile"></el-input>
                <el-button @click="Picurltj()">提交</el-button>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" v-if="addCourseDialog.nameDisabled"  @click="updateCourse" :disabled="addCourseDialog.disabled">确 定</el-button>
                <el-button type="primary" v-else @click="addUser" :disabled="addCourseDialog.disabled">新增</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>





    <div style="display: flex;justify-content: center">
        <el-pagination
                layout="prev, pager, next"
                :total="total" current-page.sync="page" @current-change="pageChange">
        </el-pagination>
    </div>

</div>
</body>


<script>

    axios.defaults.headers.common['Authorization'] = "bearer " + sessionStorage.getItem("access_token");
    axios.defaults.headers.common['Content-Type'] = 'application/json;charset=UTF-8';
    var Main = {

        data() {
            return {

                selectUserData:[],
                addCourseDialog: {
                    // 模态框显示
                    show: false,
                    // 课程id
                    courId: '',
                    // 模态框标题
                    title: '',
                    // 课程名称
                    courName: '',
                    //教师id
                    courTeaid: '',
                    //课程的价格
                    courPrice:'',
                    courContent:'',
                   // courOpentime:'',
                   // courClosetime:'',
                    courPicurl:'',
                    disabled:false,
                    nameDisabled:true,
                    courMark:'',
                },

                //表格数据（分页）
                tableData: [],
                cour_name: "",
                page: 1,
                pageSize: 10,
                total: 0,

            }
        },

        methods: {
            hanfgg(row){
                var courId=row.courId;
                localStorage.setItem("courId",courId);
                window.location.href="notice.html?courId="+courId;
            },
            Picurltj() {
                let file = document.getElementById("Picurlfile").files[0];
                if (file == null) {
                    this.$message({
                        message: '请选择文档再提交',
                        type: 'warning'
                    })
                    return;
                }
                let path = "courPicurl/" + new Date().getTime() + file.name;
                this.addCourseDialog.disabled=true;
                let formData = new FormData();
                formData.append('path', path);
                formData.append('file', file);
                axios({
                    method: 'post',
                    url: '/api/oss/upload',
                    data: formData,
                    headers: {
                        'Content-Type': 'multipart/form-data',
                    }
                }).then(res=>{
                    res=res.data;
                    this.addCourseDialog.disabled=false;
                    if(res.success){
                        this.$message({
                            message:'上传完成',
                            type:"success"
                        })
                        this.addCourseDialog.courPicurl=res.message.path;
                    }
                    axios({
                        method: 'get',
                        url: '/api/oss/getUrl',
                        params:{
                            path:path
                        }
                    })
                })

            },
            getCommit(row) {
                var courId=row.courId;
                localStorage.setItem("courId",courId);
                window.location.href="admin.html?courId="+courId

            },
            handleSelectionChange(val) {
                this.selectUserData = val
            },
            // 修改章节
            updateCourse() {
                let params = new URLSearchParams()
                params.append('courId', this.addCourseDialog.courId)
                params.append('courName', this.addCourseDialog.courName)
                params.append('courPrice', this.addCourseDialog.courPrice)
                params.append('courMark', this.addCourseDialog.courMark)
                params.append('courPicurl', this.addCourseDialog.courPicurl)
                params.append('courContent', this.addCourseDialog.courContent)
              //  params.append('courOpentime', this.addCourseDialog.courOpentime)
              //  params.append('courClosetime', this.addCourseDialog.courClosetime)
                this.$refs['addForm'].validate((valid) => {
                    axios({
                        method: 'post',
                        url: '/api/teacher/course/updateCourseAll',
                        data: params,
                        headers: {
                            "Authorization": "bearer " + sessionStorage.getItem("access_token")
                        }
                    })
                        .then(() => {
                            this.$message({
                                type: 'success',
                                message: '修改成功!',
                            });
                            this.addCourseDialog.show = false
                            this.queryCourse()
                        }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '修改失败'
                        });
                    })
                })

            },


            showUpdateUserDialog(row){
                this.addCourseDialog.courId=row.courId;
                this.addCourseDialog.courName=row.courName;
                this.addCourseDialog.courPrice=row.courPrice;
                this.addCourseDialog.courPicurl=row.courPicurl;
                this.addCourseDialog.courContent=row.courContent;
               // this.addCourseDialog.courOpentime=row.courOpentime;
               // this.addCourseDialog.courClosetime=row.courClosetime;
                this.addCourseDialog.show = true
                this.addCourseDialog.nameDisabled=true;
                this.addCourseDialog.title="修改课程";

            },
            //新增
            addUser(){
                let teaid=sessionStorage.getItem("userid");
                let params = new URLSearchParams()

                params.append('courId', this.addCourseDialog.courId)
                params.append('courName', this.addCourseDialog.courName)
                params.append('courPrice', this.addCourseDialog.courPrice)
                params.append('courPicurl', this.addCourseDialog.courPicurl)
                params.append('courContent', this.addCourseDialog.courContent)
              //  params.append('courOpentime', this.addCourseDialog.courOpentime)
             //   params.append('courClosetime', this.addCourseDialog.courClosetime)
                params.append('courTeaid', teaid)

                this.$refs['addForm'].validate((valid) => {
                    if (valid) {
                        axios({
                            method:'post',
                            url: '/api/teacher/course/addCourseAll',
                            data:params,
                            headers: {
                                "Authorization": "bearer " + sessionStorage.getItem("access_token")
                            }
                        }).then(() => {

                            this.$message({
                                type: 'success',
                                message: '新增成功!',
                            });

                            this.addCourseDialog.show = false
                            this.queryCourse()
                            this.$refs['addForm'].resetFields();
                        })
                    } else {
                        this.$message({
                            showClose: true,
                            message: '新增失败',
                            type: 'error'
                        });
                        return false;
                    }
                });
            },

            showAddCourseDialog() {
                this.addCourseDialog.courId="";
                this.addCourseDialog.courName="";
                this.addCourseDialog.courPrice="";
                this.addCourseDialog.courTeaid="";
                this.addCourseDialog.courPicurl="";
                this.addCourseDialog.courContent="";
              //  this.addCourseDialog.courOpentime="";
              //  this.addCourseDialog.courClosetime="";
                this.addCourseDialog.nameDisabled=false;
                this.addCourseDialog.title="新增课程";
                this.addCourseDialog.show=true;
            },

            //判断是否有章节
            judgeChapter(cid){
                axios({
                    method:'get',
                    url:'/api/teacher/chapter/judgeChapter',
                    params:{
                        cid:cid
                    }
                }).then(res=>{
                    res=res.data;
                    if(res.success){
                        this.judgeNotice(cid);
                    }else{
                        this.$message({
                            type:'error',
                            message:res.message
                        })
                    }
                })
            },
            //判断是否有公告
            judgeNotice(cid){
                //TODO 根据课程id判断是否有公告  如果有  不能删除  如果没有继续下一步
                this.judgeRecommend(cid);
            },
            //判断是否有推荐
            judgeRecommend(cid){
                axios({
                    method:'get',
                    url:'/api/admin/recommend/isRecommend',
                    params:{
                        cid:cid
                    }
                }).then(res=>{
                    res=res.data;
                    if(res.success){
                        this.judgeExam(cid);
                    }else{
                        this.$message({
                            type:'error',
                            message:res.message
                        })
                    }
                })
            },
            //判断考试中的 题库/测验/考试
            judgeExam(cid){
                axios({
                    method:'get',
                    url:'/api/exam/InterfaceController/query',
                    params:{
                        coureId:cid
                    }
                }).then(res=>{
                    res=res.data;
                    if(res.success){
                        this.judgeStudent(cid);
                    }else{
                        this.$message({
                            type:'error',
                            message:res.message
                        })
                    }
                })
            },
            //判断学生中的 报名/评价/学习记录
            judgeStudent(cid){
                axios({
                    method:'get',
                    url:'/api/student/judge/getRecordByCid',
                    params:{
                        cid:cid
                    }
                }).then(res=>{
                    res=res.data;
                    if(res.success){
                        this.judgeBbs(cid);
                    }else{
                        this.$message({
                            type:'error',
                            message:res.message
                        })
                    }
                })
            },
            //判断论坛中的 讨论是否有数据
            judgeBbs(cid){
                axios({
                    method:'get',
                    url:'/api/bbs/coursereply/getCoursePostNum',
                    params:{
                        courseId:cid
                    }
                }).then(res=>{
                    res=res.data;
                    if(res.success){
                        //可以删除课程了
                        this.deleteCour(cid);
                    }else{
                        this.$message({
                            type:'error',
                            message:res.message
                        })
                    }
                })
            },
            /**
             * 删除课程
             * @param cid 课程id
             */
            deleteCour(cid){
                // 开始真正的删除课程

                axios({
                    method: 'delete',
                    url: '/api/teacher/course/deleteCourseById',
                    params: {
                        courId: cid,

                    },

                })
                    .then(res => {
                        res = res.data;
                        if (res.success) {
                            this.$message({
                                type: 'success',
                                message: '删除成功!',
                            });
                            this.queryCourse()
                        }

                    })
                    .catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消删除'
                        });
                    })

            },
            //点击删除
            handleDelete(index, row) {

                this.$confirm('此操作将永久删除该课程, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                    this.judgeChapter(row.courId);
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                })




            },



            pageChange(page) {
                this.page = page;
                this.queryCourse();
            },
            search() {
                this.page = 1;
                this.queryCourse();
            },
            //分页查询课程
            queryCourse() {
                let teaid=sessionStorage.getItem("userid");

                axios({
                    method: 'get',
                    url: '/api/teacher/course/getPaginate',
                    params: {
                        page: this.page,
                        pageSize: this.pageSize,
                        courName:this.cour_name,
                        courTeaid:teaid
                    },
                    headers: {
                        "Authorization": "bearer " + sessionStorage.getItem("access_token")
                    }
                })
                    .then(res => {
                            let data = res.data;

                            this.total = data.totalElements;
                            this.tableData = data.content;

                        }
                    )

            }
        },
        mounted() {
            // 初始化数据
            this.queryCourse()
        }
    }

    var Component = Vue.extend(Main)
    new Component().$mount('#app')
</script>
</html>

